<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>定时器的执行</title>
    
</head>
<body>
    <button onclick="start()">启动定时器</button>
</body>
</html>
<script>
    
    function start() {
        /**
         * 定时器并不真的保证定时执行
         * 定时器的回调函数在主线程执行
         */
        var start = new Date().getTime()

        setTimeout(function () {
            console.log(Date.now() - start)
        }, 200)

        for (var i=0; i<1000000000; i++) {

        }
    }

    /**
     * js是单线程执行的
     */
    function fn() {
        setTimeout(function () {
            console.log('setTimeout 2000')
        }, 2000)

        setTimeout(function () {
            console.log('setTimeout 1000')
        }, 1000)
        
        alert('hello') //将当前线程执行暂停，同时暂停计时器
        
        
    }
    
    // fn()


    /**
     * js引擎先执行初始化代码（设置定时器，绑定监听，发送ajax）
     * 后面某个时刻才会执行回调代码
     *
     */
    function fn2() {
        // 初始化代码
        setTimeout(function () {
            //回调代码，从任务队列中，拿到回调函数，送到执行栈中处理
            console.log('立即执行')
        },0)
        
        // 初始化代码
        console.log('立即执行前执行！')
    }
    
    fn2()
    
</script>
